<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>

<link href="css/style.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="css/font-awesome.min.css">
<!-- SlidesJS Required: Link to jQuery -->
  <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
  <!-- End SlidesJS Required -->

  <!-- SlidesJS Required: Link to jquery.slides.js -->
  <script src="js/jquery.slides.min.js"></script>
  <!-- End SlidesJS Required -->
    <link rel="stylesheet" href="js/source/jquery.fancybox.css?v=2.1.5" type="text/css" media="screen" />
	<script type="text/javascript" src="js/source/jquery.fancybox.pack.js?v=2.1.5"></script>
  <!-- SlidesJS Required: Initialize SlidesJS with a jQuery doc ready -->
  <script>
    $(function() {
      $('#slides').slidesjs({
		  height: 300,
        navigation: false,
		        play: {
          active: false,
          auto: true,
          interval: 2000,
          swap: false,
          pauseOnHover: false,
          restartDelay: 2000
        }
      });
	  $(".fancybox").fancybox();
    });
  </script>
  <!-- End SlidesJS Required -->
  
</head>
  

<body>
	<div class="toppanelholder">
    	<div class="wrapper">
            <div id="toppanel">
            	<div class="toppanel-wrapper">
                    <form action="#" method="">
                        <label for="username">Username</label>
                        <input type="text" name="username" id="username" />
                        <label for="psw">Password</label>
                        <input type="password" name="psw" id="psw" />
                        <input type="submit" value="GO" />
                        <br />
                        <p style="text-align: center; margin: 5px;">
                        <a href="#">Forgot Password?</a>&nbsp;&nbsp;&nbsp;
                        <a href="#">Register?</a>&nbsp;&nbsp;&nbsp;
                        <a href="#">Login with Facebook</a>
                        </p>
                    </form>
				</div>
            </div>
		</div>
    </div>
	<div class="wrapper">
    	<header>
        	<div id="logo">
            	<img src="images/logo.gif" width="203" height="84" />
            </div>
            </header>
        <nav>
        	<ul>
            	<li><a href="index.html">home</a></li>
                <li><a href="chatroom.html">chat room</a></li>
                <li class="active"><a href="booking.html">booking</a></li>
                <li><a href="contact.html">contact</a></li>
                <li><a href="about.html">about</a></li>
            </ul>
        </nav>
    </div>
    <div id="banner">
    
<!-- SlidesJS Required: Start Slides -->
  <!-- The container is used to define the width of the slideshow -->
  <div class="container">
    <div id="slides">
    	<img src="images/blur_img1.jpg" />
        <img src="images/blur_img2.jpg" />
        <img src="images/blur_img3.jpg" />
      <a href="#" class="slidesjs-previous slidesjs-navigation"><i class="icon-chevron-left icon-large"></i></a>
      <a href="#" class="slidesjs-next slidesjs-navigation"><i class="icon-chevron-right icon-large"></i></a>
    </div>
  </div>
  <!-- End SlidesJS Required: Start Slides -->
  
    </div>
    <div class="wrapper">
        <section id="maincontent">
            <div id="about-panel">
                <div class="panel-main-wrapper">
                	<div class="panel-3col">
                        <div class="panel-3col-heading">
                            ROBOT BOOKING...
                        </div>
                        <div class="panel-3col-content02">
							<div class="panel-3col-content-booking-left">
								<div class="panel-3col-heading-booking">
								OPTIMUS
								</div>
								<div class="panel-3col-heading-booking">
								CERBERUS
								</div>
								<div class="panel-3col-heading-booking">
								WORLD INVADER
								</div>
							</div>
							<div class="panel-3col-content-booking">
								<table width="82%" style="width: 75%">
<tr>
										<td></td>
										<td><div align="center">MONDAY
										</div></td>
										<td><div align="center">TUESDAY										</div></td>
										<td><div align="center">WEDNESDAY										</div></td>
										<td><div align="center">THURSDAY										</div></td>
										<td><div align="center">FRIDAY										</div></td>
									</tr>
									<tr>
										<td><div align="center">10am - 11am</div></td>
										<td><p align="center">QV101
										</p>
									      <form id="form1" name="form1" method="post" action="">
									        <label>
									          <div align="center">
									            <input type="radio" name="radio" id="mon_01" value="mon_01" />
								              </div>
									        </label>
							            </form>									      <p>&nbsp;</p></td>
										<td><p align="center">QV102
										</p>
									      <form id="form2" name="form2" method="post" action="">
									        <label>
									          <div align="center">
									            <input type="radio" name="radio" id="tue_01" value="tue_01" />
								              </div>
									        </label>
							            </form>									      <p>&nbsp;</p>										</td>
										<td><p align="center">QV101</p>
									      <form id="form3" name="form3" method="post" action="">
									        <label>
									          <div align="center">
									            <input type="radio" name="radio" id="wed_01" value="wed_01" />
								              </div>
									        </label>
							            </form>									      <p>&nbsp;</p>										</td>
										<td><p align="center">QV104
										</p>
									      <form id="form4" name="form4" method="post" action="">
									        <label>
									          <div align="center">
									            <input type="radio" name="radio" id="thu_01" value="thu_01" />
								              </div>
									        </label>
							            </form>									      <p>&nbsp;</p>										</td>
										<td><p align="center">QV101</p>
									      <form id="form5" name="form5" method="post" action="">
									        <label>
									          <div align="center">
									            <input type="radio" name="radio" id="fri_01" value="fri_01" />
								              </div>
									        </label>
							            </form>									      <p>&nbsp;</p>										</td>
									</tr><tr>
										<td><div align="center">11am - 12pm</div></td>
										<td><div align="center">
										  <p>QV102</p>
										  <form id="form6" name="form6" method="post" action="">
										    <label>
										      <input type="radio" name="radio" id="mon_02" value="mon_02" />
									        </label>
									      </form>
										  <p>&nbsp;</p>
										</div></td>
										<td><div align="center">
										  <p>QV101</p>
										  <form id="form7" name="form7" method="post" action="">
										    <label>
										      <input type="radio" name="radio" id="tue_02" value="tue_02" />
									        </label>
									      </form>
										  <p>&nbsp;</p>
										</div></td>
										<td><div align="center">
										  <p>QV201</p>
										  <form id="form8" name="form8" method="post" action="">
										    <label>
										      <input type="radio" name="radio" id="wed_02" value="wed_02" />
									        </label>
									      </form>
										  <p>&nbsp;</p>
										</div></td>
										<td><div align="center">
										  <p>QV101</p>
										  <form id="form9" name="form9" method="post" action="">
										    <label>
										      <input type="radio" name="radio" id="thu_02" value="thu_02" />
									        </label>
									      </form>
										  <p>&nbsp;</p>
										</div></td>
										<td><div align="center">
										  <p>QV102</p>
										  <form id="form10" name="form10" method="post" action="">
										    <label>
										      <input type="radio" name="radio" id="wed_" value="wed_02" />
									        </label>
									      </form>
										  <p>&nbsp;</p>
										</div></td>
									</tr><tr>
										<td><div align="center">12pm - 1pm</div></td>
										<td><div align="center">
										  <p>QV102</p>
										  <form id="form11" name="form11" method="post" action="">
										    <label>
										      <input type="radio" name="radio" id="mon_03" value="mon_03" />
									        </label>
									      </form>
										  <p>&nbsp;</p>
										</div></td>
										<td><div align="center">
										  <p>QV104</p>
										  <form id="form12" name="form12" method="post" action="">
										    <label>
										      <input type="radio" name="radio" id="tue_03" value="tue_03" />
									        </label>
									      </form>
										  <p>&nbsp;</p>
										</div></td>
										<td><div align="center">
										  <p>QV101</p>
										  <form id="form13" name="form13" method="post" action="">
										    <label>
										      <input type="radio" name="radio" id="wed_03" value="wed_03" />
									        </label>
									      </form>
										  <p>&nbsp;</p>
										</div></td>
										<td><div align="center">
										  <p>QV102</p>
										  <form id="form14" name="form14" method="post" action="">
										    <label>
										      <input type="radio" name="radio" id="thu_03" value="thu_03" />
									        </label>
									      </form>
										  <p>&nbsp;</p>
										</div></td>
										<td><div align="center">
										  <p>QV104</p>
										  <form id="form15" name="form15" method="post" action="">
										    <label>
										      <input type="radio" name="radio" id="fri_03" value="fri_03" />
									        </label>
									      </form>
										  <p>&nbsp;</p>
										</div></td>
									</tr><tr>
										<td><div align="center">1pm - 2pm</div></td>
										<td><div align="center">
										  <p>QV104</p>
										  <form id="form16" name="form16" method="post" action="">
										    <label>
										      <input type="radio" name="radio" id="mon_04" value="mon_04" />
									        </label>
									      </form>
										  <p>&nbsp;</p>
										</div></td>
										<td><div align="center">
										  <p>QV102</p>
										  <form id="form17" name="form17" method="post" action="">
										    <label>
										      <input type="radio" name="radio" id="tue_04" value="tue_04" />
									        </label>
									      </form>
										  <p>&nbsp;</p>
										</div></td>
										<td><div align="center">
										  <p>QV104</p>
										  <form id="form18" name="form18" method="post" action="">
										    <label>
										      <input type="radio" name="radio" id="wed_04" value="wed_04" />
									        </label>
									      </form>
										  <p>&nbsp;</p>
										</div></td>
										<td><div align="center">
										  <p>QV101</p>
										  <form id="form19" name="form19" method="post" action="">
										    <label>
										      <input type="radio" name="radio" id="thu_04" value="thu_04" />
									        </label>
									      </form>
										  <p>&nbsp;</p>
										</div></td>
										<td><div align="center">
										  <p>QV104</p>
										  <form id="form20" name="form20" method="post" action="">
										    <label>
										      <input type="radio" name="radio" id="thu_" value="thu_04" />
									        </label>
									      </form>
										  <p>&nbsp;</p>
										</div></td>
									</tr><tr>
										<td><div align="center">2pm - 3pm</div></td>
										<td><div align="center">
										  <p>QV101</p>
										  <form id="form21" name="form21" method="post" action="">
										    <label>
										      <input type="radio" name="radio" id="mon_05" value="mon_05" />
									        </label>
									      </form>
										  <p>&nbsp;</p>
										</div></td>
										<td><div align="center">
										  <p>QV102</p>
										  <form id="form22" name="form22" method="post" action="">
										    <label>
										      <input type="radio" name="radio" id="tue_05" value="tue_05" />
									        </label>
									      </form>
										  <p>&nbsp;</p>
										</div></td>
										<td><div align="center">
										  <p>QV101</p>
										  <form id="form23" name="form23" method="post" action="">
										    <label>
										      <input type="radio" name="radio" id="wed_05" value="wed_05" />
									        </label>
									      </form>
										  <p>&nbsp;</p>
										</div></td>
										<td><div align="center">
										  <p>QV104</p>
										  <form id="form24" name="form24" method="post" action="">
										    <label>
										      <input type="radio" name="radio" id="thu_05" value="thu_05" />
									        </label>
									      </form>
										  <p>&nbsp;</p>
										</div></td>
										<td><div align="center">
										  <p>QV104</p>
										  <form id="form25" name="form25" method="post" action="">
										    <label>
										      <input type="radio" name="radio" id="fri_05" value="fri_05" />
									        </label>
									      </form>
										  <p>&nbsp;</p>
										</div></td>
									</tr>
								</table>
						  </div>
                            <!--<div class="readmore-wrapper"><a href="#" class="readmore">read more</a></div>-->
                        </div>
                    </div>
                </div>
                <!--<div class="panel-3col-wrapper">
                	<div class="panel-3col">
                        <div class="panel-3col-heading">
                            High score...
                        </div>
                        <div class="panel-3col-content">
                        	<ol>
                            	<li><span class="name">Adam</span><span class="score">180</span></li>
                                <li><span class="name">Jacky</span><span class="score">178</span></li>
                                <li><span class="name">Emily</span><span class="score">165</span></li>
                                <li><span class="name">Nirajan</span><span class="score">150</span></li>
                                <li><span class="name">Dung</span><span class="score">149</span></li>
                                <li><span class="name">Jack</span><span class="score">145</span></li>
							</ol>
                            <div class="readmore-wrapper"><a href="#" class="readmore">read more</a></div>
                        </div>
                    </div>
                </div>-->
                <!--<div class="panel-3col-wrapper">
                	<div class="panel-3col last">
                        <div class="panel-3col-heading">
                            Lego robot...
                        </div>
                        <div class="panel-3col-content">
                            <ul id="robotsgallery">
                            	<li><a class="fancybox" rel="group" href="images/31313_FRONT_320.png"><img src="images/31313_FRONT_320.png"/></a></li>
                                <li><a class="fancybox" rel="group" href="images/BOBB3E_320.png"><img src="images/BOBB3E_320.png"/></a></li>
                                <li><a class="fancybox" rel="group" href="images/DINOR3X_320.png"><img src="images/DINOR3X_320.png" /></a></li>
                                <li><a class="fancybox" rel="group" href="images/EV3MEG_320.png"><img src="images/EV3MEG_320.png"/></a></li>
                                <li><a class="fancybox" rel="group" href="images/GRIPPER_320.png"><img src="images/GRIPPER_320.png" /></a></li>
                                <li><a class="fancybox" rel="group" href="images/MR_B3AM_320.png"><img src="images/MR_B3AM_320.png"/></a></li>
                                <li><a class="fancybox" rel="group" href="images/SCORPION_320.png"><img src="images/SCORPION_320.png" /></a></li>
                                <li><a class="fancybox" rel="group" href="images/SNAKE_320.png"><img src="images/SNAKE_320.png"/></a></li>
                                <li><a class="fancybox" rel="group" href="images/TRACKER_320.png"><img src="images/TRACKER_320.png" /></a></li>
                            </ul>
                        </div>
                    </div>
                </div>-->
            </div>
        </section>
	</div>
    <div class="clear"></div>
    <footer>
    	<div id="cerberuslogo">
        	<img src="images/cerberuslogo.gif" width="140" height="29" />
        </div>
        <div id="copyright">
        	Copyright information
        </div>
    </footer>
</body>
</html>
